<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>盒/框模型</title>
		<style>
			div{
				/*div 空间 特点：有宽没高  设置宽高*/
				width: 200px;
				height: 200px;
				border: 1px solid red;
				1.什么是盒/框模型?
				任何元素存在于盒模型中
				2.盒模型包括什么?
				外边距+边框+内边距+内容
				3.外边距margin属性边框以外距离使用方式与border类似{微调:推}
				语法:margin:属性值:为1个值，顺时针，代表方向:上 右 下 左
				                  为2个值，顺时针，代表方向:上下 右左
								  为3个值，顺时针，代表方向:上 右左 下
								  为4个值，顺时针，代表方向:上 右 下 左
				3.1外边距-方向属性
				margin-left:数值px;      
				margin-right:数值px;
				-margin-top:数值px;
				margin-bottom:数值pX
				
								  
    */
   }
    margin: 100px;
    margin:100px 200px;
    margin:100px 200px 300px;
    margin:100px 200px 300px 400px;
	margin-left: 150px;
	margin:0 auto;
	
}
		</style>
	</head>
	<body>
		<div></div>
	</body>
</html>